import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import { createHtmlPlugin } from 'vite-plugin-html'
import { resolve } from 'path';

import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import eslintPlugin from 'vite-plugin-eslint'

import Unocss from 'unocss/vite'
import { presetAttributify, presetIcons, presetUno } from 'unocss'

import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
import path from 'path'
import { viteMockServe } from 'vite-plugin-mock'
// import MonacoWebpackPlugin from 'monaco-editor-webpack-plugin'
const getViteEnv = (mode: string, target: string) => {
  return loadEnv(mode, process.cwd())[target]
}
const localEnabled: boolean =
  (process.env.USE_MOCK as unknown as boolean) || false
const prodEnabled: boolean =
  (process.env.USE_CHUNK_MOCK as unknown as boolean) || false
export default defineConfig(({ mode }) => {
  //获取各种环境下的对应的变量
  const env = loadEnv(mode, process.cwd())
  return {
    server: {
      open: false,
      host: '0.0.0.0',
      port: 4000,
      proxy: {
        '/paas/libraryx': {
          target: 'http://192.168.0.41:9040/',
          changeOrigin: true,
          secure: false,
          pathRewrite:{
            '^/paas/libraryx': ''
          }
        },
      },
    },
    plugins: [
      vue({
        // reactivityTransform: true,
      }),
      createHtmlPlugin({
        inject: {
          data: {
            title: getViteEnv(mode, 'VITE_APP_TITLE'),
            configPath: getViteEnv(mode, 'VITE_APP_CONFIG'),
          },
        },
      }),
      AutoImport({
        imports: ['vue', 'vue-router', 'pinia'],
        resolvers: [ElementPlusResolver()],
        dirs: ['src/components'],
        dts: './src/auto-imports.d.ts',
        eslintrc: {
          enabled: true, //设置为ture
          filepath: './src/.eslintrc-auto-import.json',
          globalsPropValue: true,
        },
      }),
      Components({
        resolvers: [ElementPlusResolver()],
      }),
      Unocss({
        presets: [
          presetUno(),
          presetAttributify(),
          presetIcons({
            scale: 1.2,
            warn: true,
          }),
        ],
        rules: [['bg-blue-paas', { 'background-color': '#028aff' }]],
      }),
      eslintPlugin({
        include: ['src/**/*.ts', 'src/**/*.vue', 'src/*.ts', 'src/*.vue'],
        cache: false,
      }),
      createSvgIconsPlugin({
        // Specify the icon folder to be cached
        iconDirs: [path.resolve(process.cwd(), 'src/assets/icons')],
        // Specify symbolId format
        symbolId: 'icon-[dir]-[name]',
      }),
      viteMockServe({
        // enable: command === 'serve',
      }),
      // new MonacoWebpackPlugin(),
      viteMockServe({
        // ↓解析根目录下的mock文件夹
        mockPath: 'mock',
        localEnabled: localEnabled, // 开发打包开关
        prodEnabled: prodEnabled, // 生产打包开关
        supportTs: true, // 打开后，可以读取 ts 文件模块。 请注意，打开后将无法监视.js 文件。
        watchFiles: true, // 监视文件更改
      }),
    ],
    resolve: {
      alias: {
        '@': path.resolve('./src'),
      },
    },
    //scss全局变量一个配置
    css: {
      preprocessorOptions: {
        scss: {
          javascriptEnabled: true,
          additionalData: '@import "./src/style/variable.scss";',
        },
      },
    },
    build: {
      outDir: 'tmon',
    }
  }
})
